<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ServerSentEvent</title>
</head>
<body>
<button>Closed Button!</button>
<ul>

</ul>
<script>
    var button = document.querySelector("button");
    var eventList = document.querySelector("ul");

    var evtSource  = new EventSource('http://127.0.0.1:8848/see');

    evtSource.onmessage = function(e){
        console.log("data:"+e.data);
        var newElement = document.createElement("li");
        newElement.innerHTML = "default data :"+e.data;
        eventList.appendChild(newElement);
    }

    evtSource.onopen = function(){
        console.log("connect is open");
    }

    evtSource.onerror = function(){
        console.log("connect is error");
    }

    button.onclick = function (){
        console.log("connect is close");
        evtSource.close();
    }

    evtSource.addEventListener("SSE_EVENT",function (e){
        var newElement = document.createElement("li");
        newElement.innerHTML = "EVENT data:"+e.data;
        eventList.appendChild(newElement);
    });
</script>
</body>
</html>